# Introduction

The plugin system is a crucial part of Rspress, which allows you to easily extend the abilities of Rspress during the process of building a site. So, what ability can you extend with plugins? Let's take a look at the overall architecture of Rspress first.

The overall architecture of Rspress is shown in the figure below:

![Rspress Architecture](https://lf3-static.bytednsdoc.com/obj/eden-cn/uhbfnupenuhf/edenx-doc/arch-en.png)

Rspress is divided into two parts: **Node Side** and **Browser Runtime**. Through the plugin system, you can easily extend the abilities of these two parts. Specifically, you can extend the ability to:

- [**Markdown/MDX compilation**](/plugin/system/plugin-api#markdown)。You can add [`remark`](https://github.com/remarkjs/remark)/[`rehype`](https://github.com/rehypejs/rehype) plugins to extend the compilation ability of Markdown/MDX.
- [**Add custom page**](/plugin/system/plugin-api#addpages). On the basis of Rspress's conventional routing, you can also add new routes through plugins, such as adding a `/blog` route to display a list of blogs, and the content is defined by yourself.
- [**Custom build tool behavior**](/plugin/system/plugin-api#builderconfig).In Rspress plugin, you can customize the config of the underlying build tool [Rsbuild](https://rsbuild.rs), and you can also add some Rspack or Rsbuild plugins.
- [**Extend page metadata**](/plugin/system/plugin-api#extendpagedata). For each page, some metadata will be calculated inside Rspress, such as `title`, `description`, etc. You can extend the calculation logic of these metadata through plugins, and pass [usePageData](/api/client-api/api-runtime.html#usepagedata) hook access.
- Insert some [**custom logic**](/plugin/system/plugin-api#beforebuild/afterbuild) before and after the build process. Such as closing some event listeners after the build process ends.
- [**Add global components**](/plugin/system/plugin-api#globaluicomponents). Rspress internally uses React for rendering. You can flexibly extend the runtime page by defining global React components, such as `adding a global BackToTop (return to top) component`, `adding a global side effect logic`.
